@mixin singleLine {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@mixin lineClamp($num: 3) {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: $num;
}
@mixin flexVH($jc: center) {
  display: flex;
  align-items: center;
  justify-content: $jc;
}

$flexDirection: column, row;

@each $name in $flexDirection {
  .flex-#{$name} {
    display: flex;
    flex-direction: $name;
    .flex-auto {
      flex: 1 1 auto;
      overflow: auto;
    }
    .flex-hide {
      flex: 1 1 auto;
      overflow: hidden;
    }
  }
}
.flex-s-b{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flex-start{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.operate-wrap{
  & > *:not(:last-child) {
    margin-right: 16px;
  }
}
.single-line {
  @include singleLine
}